<template>
  <div class="dashboard-container">
    <component :is="currentRole"></component>
    <!--<iframe :height="scrollHeight" width="100%" style="padding:0;margin:0;"-->
            <!--src="https://119.145.168.112:56080/extensions/FSElectronicPort/FSElectronicPort.html"-->
            <!--frameborder="0" scrolling="auto"></iframe>-->
  </div>
</template>

<script>
  import { mapGetters } from 'vuex'
  import adminDashboard from './admin'
  import editorDashboard from './editor'

  export default {
    name: 'dashboard',
    components: {adminDashboard, editorDashboard},
    data() {
      return {
        currentRole: 'adminDashboard',
        scrollHeight: 0
      }
    },
    computed: {
      ...mapGetters([
        'roles'
      ])
    },
    created() {
      if (!this.roles.includes('admin')) {
        this.currentRole = 'editorDashboard'
      }


      this.scrollHeight = document.body.scrollHeight - 90
      window.onresize = () => {
        this.scrollHeight = document.body.scrollHeight - 90
      }

    }


  }
</script>
